<template>
    <div>
        <city-header></city-header>
        <cesium-containercc :newArr5 ="newArr5"></cesium-containercc>
        <div class="cityLeftContent">
            <cityLeft-contentOne :weatherList="weatherList" :CityEPAdata="CityEPAdata" :AllCityAqi="AllCityAqi" :QXZS="QXZS"></cityLeft-contentOne>
            <cityLeft-contentTwo></cityLeft-contentTwo>
            <cityLeft-contentThree :CityEPAdata="CityEPAdata" :AllCityAqi="AllCityAqi"></cityLeft-contentThree>   
        </div>
        <right-tool></right-tool>
        <common-bottom></common-bottom>
        <city-centerContent :QXZs24h="QXZs24h" :QXZs7day="QXZs7day"></city-centerContent>
        <common-legend></common-legend>
        <!-- <city-stationCount :getStationCountData="getStationCountData" :StationQXDJCounts="StationQXDJCounts" :CityEPAdata="CityEPAdata"></city-stationCount> -->
        <!-- <common-controlBtn></common-controlBtn> -->
    </div>
</template>
<script>
import CesiumContainercc from '../cesium/CesiumContainercc'
import CityHeader from './components/CityHeader'
import RightTool from '../commons/RightTool'
import CityLeftContentOne from './components/CityLeftContentOne'
import CityLeftContentTwo from './components/CityLeftContentTwo'
import CityLeftContentThree from './components/CityLeftContentThree'
import CityCenterContent    from '../cityW/components/CityCenterContent'
import CommonBottom from '../commons/CommonBottom'
import CityStationCount from './components/CityStationCount'
import CommonLegend from '../commons/CommonLegend'
//import CommonControlBtn from '../commons/CommonControlBtn'
//import serveUrl from './serve.js'
import axios from 'axios'
export default {
    name: 'City',
    data(){
        return{
           timer:null,
           weatherList: null,
           city_code: '',
           timer: null,
           CityEPAdata:{},       
           AllCityAqi:{},
           QXZs24h:[],
           QXZs7day:[],
           newArr5:[],
           QXZS:{},
           dingwei:'dw'
        }
    },
    watch: {
        city_code: function(){
            this.getWeather();
        }
    },
    components: {
        CesiumContainercc,
        CityHeader,
        RightTool,
        CityLeftContentOne,
        CityLeftContentTwo,
        CityLeftContentThree,
        CommonBottom,
        CommonLegend,
        // CommonControlBtn,
        CityCenterContent,
        CityStationCount
    },
    beforeDestroy(){
        if(this.timer){
          clearInterval(this.timer)
        }
    },
    beforeMount(){
        this.$store.commit("changeForq",1)
    },
    mounted(){
        this.$store.commit("changeForq",1)
        this.$comjs.addError1(this.$store.state.objPopup7);
        this.$comjs.onCenter(119.906064,29.573401,961893.0);
        $('div[id^="popup-fylzCity"]').hide();
        this.changeMarker();   
        this.getCountyWData();  
        this.getWeather();
        var date = new Date();//现在时刻
        var dateIntegralPoint = new Date();//用户登录时刻的下一个整点，也可以设置成某一个固定时刻
        dateIntegralPoint.setHours(date.getHours()+1);//小时数增加1
        dateIntegralPoint.setMinutes(10);
        dateIntegralPoint.setSeconds(0);
        console.log(dateIntegralPoint);
        console.log(dateIntegralPoint-date);
        console.log((dateIntegralPoint-date)/60000);
        setTimeout(()=>{this.andUpdata()},dateIntegralPoint-date);//用户登录后的下一个整点执行。
        
    },
    methods: {
        changeMarker(){
            $('div[id*="qixiangCityMarker"]').show();
            $('div[id*="fuyangCityMarker"]').hide();
            $('div[id*="qixiangProvinceMarker"]').show();
            $('div[id*="fuyangProvinceMarker"]').hide();
        },
        
        getWeather(){
            axios.get('/api'+ "101210101").then(
                this.getWeatherInfo
            ).catch(function(res){
                    
                });
        },
        getWeatherInfo(res){
            this.weatherList = res.data.data
        },

        // getCityData(){           
        //     axios.get('/FYLZCity.json').then(
        //         this.getCityDataInfo
        //     )
        // },
        // getCityDataInfo(res){
        //     this.CityEPAdata=res.data.CityEPAdata;
        //     this.AllCityAqi=res.data.AllCityAqi[0];                   
        // },

        getCountyWData(){    
            console.log('qiiqiq')
            if(this.$comjs.isOnline){
                axios.get('/apis/api/QX/GetQXCountryInfo?country='+this.$store.state.headerCounty).then(
                    this.getCityWDataInfo
                )
            }else{
                axios.get(this.$comjs.qhzsCountry).then(
                    this.getCityWDataInfo
                )
            }
        },
        getCityWDataInfo(res){
            if(res.data.CountryEPAdata){
                this.CityEPAdata=res.data.CountryEPAdata;
            }  
            if(res.data.AllCountryAqi){
                this.AllCityAqi=res.data.AllCountryAqi;   
            }
            if(res.data.QXZs24h){
                this.QXZs24h=res.data.QXZs24h; 
            }
            if(res.data.QXZs7day){
                this.QXZs7day=res.data.QXZs7day;
            }
            if(res.data.StationQXZs){
                this.newArr5 = res.data.StationQXZs; 
            }
            if(res.data.QXZS){
                this.QXZS = res.data.QXZS
                if(this.dingwei=='dw'){
                    this.$comjs.onCenter(res.data.QXZS.Lon,res.data.QXZS.Lat,238000.0);
                }
                
                this.$store.commit('changeCountyX',res.data.QXZS.Lon)
                this.$store.commit('changeCountyY',res.data.QXZS.Lat)
            }
            if(res.data.Regions){
                 this.$store.commit("changeStation",res.data.Regions)    
            }
            if(this.CityEPAdata.City){
                localStorage.setItem('headerCity',this.CityEPAdata.City);
            }     
        },
        andUpdata(){
         this.dingwei='bdw'
         this.getCountyWData()//在整点执行的函数，在每个整点都调用该函数
         this.timer =  setInterval(()=>{this.getCountyWData()},60*60*1000);//一个小时执行一次，那么下一个整点，下下一个整点都会执行
        }
    }
}
</script>
<style scoped>
    .cityLeftContent{
        position: absolute;
        left: 0;
        top: 6.57vh;
        z-index: 2;
        width: 4.02rem;
        height: calc(100% - 12.3vh); 
        /* height: 87.7vh; */
        /* overflow: hidden */
    }
</style>

